﻿<!DOCTYPE html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
  <head>

    <!-- BASICS -->
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

    <title>Minimal - Front Page Template / Contacts</title>

    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="icon" type="image/ico" href="assets\images\favicon.ico">

    <link href="assets\css\vendor\bootstrap\bootstrap.min.css" rel="stylesheet">
    <link href="font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">
    <link rel="stylesheet" href="assets\css\vendor\animate\animate.css">
    <link rel="stylesheet" href="assets\css\vendor\bootstrap-checkbox.css">
    <link rel="stylesheet" href="assets\css\vendor\ribbons\3d-corner-ribbons.css">
    <link rel="stylesheet" href="assets\js\vendor\text-rotator\css\simpletextrotator.css">

    <!-- Important Owl stylesheet -->
    <link rel="stylesheet" href="assets\js\vendor\owl-carousel\css\owl.carousel.css">
    <link rel="stylesheet" href="assets\js\vendor\owl-carousel\css\owl.theme.css">
    <link rel="stylesheet" href="assets\js\vendor\owl-carousel\css\owl.transitions.css">

    <link rel="stylesheet" href="assets\js\vendor\nivo-lightbox\css\nivo-lightbox.css">
    <link rel="stylesheet" href="assets\js\vendor\nivo-lightbox\css\themes\default\default.css" type="text/css">


    <!-- CUSTOM STYLE -->
    <link rel="stylesheet" href="assets\css\minimal.min.css">

  </head>
   
  <body>






  <!-- Preloader -->
  <div class="mask"><div id="loader"></div></div>
  <!--/Preloader -->





    <!-- BEGIN NAVBAR -->
    <div class="navbar navbar-fixed-top" role="navigation" data-0="line-height:80px; height:80px;-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);" data-300="line-height:40px; height:40px;-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);">
      
      <div class="container">
          
        




        <!-- Branding -->
        <div class="navbar-header">
          <a class="navbar-brand" href="index.html" data-0="padding-top:23px;padding-left: 55px;background-position: 0 16px;background-size: 44px 44px;font-size: 24px;height: 80px;" data-300="padding-top: 10px;padding-left: 40px;background-position: 0 7px;background-size: 34px 34px;font-size: 16px; height: 50px;">
            <strong>MIN</strong>IMAL
            <span class="subheading" data-0="font-size: 11px;line-height: 13px;" data-300="font-size: 9px;line-height: 8px;">front page template</span>
          </a>
          <div class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
            <a href="#">
              <i class="fa fa-bars"></i>
            </a>
          </div>
        </div>
        <!-- Branding end -->

        





        <div class="navbar-collapse collapse">
          <ul class="nav navbar-nav">
            <li><a href="index.html" data-0="padding: 30px 25px 22px;border-bottom-width:4px;" data-100="padding: 24px 25px 16px;border-bottom-width:3px;" data-200="padding: 15px 25px 12px;border-bottom-width:2px;" data-300="padding: 15px 25px 10px;border-bottom-width:1px;">Home</a></li>

            <li class="dropdown dropdown-mega" data-init="onHover">
              <a href="#" class="dropdown-toggle" data-toggle="dropdown" data-0="padding: 30px 25px 22px;border-bottom-width:4px;" data-100="padding: 24px 25px 16px;border-bottom-width:3px;" data-200="padding: 15px 25px 12px;border-bottom-width:2px;" data-300="padding: 15px 25px 10px;border-bottom-width:1px;">
                Mega Menu <span class="caret"></span>
              </a>
              <ul class="dropdown-menu" role="menu">
                <li>
                  <div class="megamenu-content">
                    <div class="row">

                      <div class="col-md-4 megamenu-col">
                        <h4>Computers</h4>
                        <ul>
                          <li><a href="index.html">Desktop Computers</a></li>
                          <li><a href="index.html">Notebook Computers</a></li>
                          <li><a href="index.html">Point of Sale Computers</a></li>
                          <li><a href="index.html">Tablets and Tablet PCs</a></li>
                          <li><a href="index.html">Thin Clients</a></li>
                          <li><a href="index.html">Workstations</a></li>
                        </ul>
                      </div>

                      <div class="col-md-4 megamenu-col">
                        <h4>Memory</h4>
                        <ul>
                          <li><a href="index.html">Desktop Memory</a></li>
                          <li><a href="index.html">Flash Memory</a></li>
                          <li><a href="index.html">Mac Memory</a></li>
                          <li><a href="index.html">Memory Adapters</a></li>
                          <li><a href="index.html">Mobile Phone Memory</a></li>
                          <li><a href="index.html">Notebook Memory</a></li>
                          <li><a href="index.html">Server Memory</a></li>
                          <li><a href="index.html">USB Flash Drive</a></li>
                        </ul>
                      </div>

                      <div class="col-md-4 megamenu-col">
                        <h4>Accessories</h4>
                        <ul>
                          <li><a href="index.html">Computer Components</a></li>
                          <li><a href="index.html">Keyboards</a></li>
                          <li><a href="index.html">Speakers</a></li>
                        </ul>

                        <h4>Scanners</h4>
                        <ul>
                          <li><a href="index.html">Barcode Scanner</a></li>
                          <li><a href="index.html">Document Scanner</a></li>
                        </ul>
                      </div>

                    </div>
                  </div>
                </li>
              </ul>
            </li>

            <li class="dropdown active" data-init="onHover">
              <a href="#" class="dropdown-toggle" data-toggle="dropdown" data-0="padding: 30px 25px 22px;border-bottom-width:4px;" data-100="padding: 24px 25px 16px;border-bottom-width:3px;" data-200="padding: 15px 25px 12px;border-bottom-width:2px;" data-300="padding: 15px 25px 10px;border-bottom-width:1px;">
                Pages <span class="caret"></span>
              </a>
              <ul class="dropdown-menu" role="menu">
                <li><a href="about.html">Abous Us</a></li>
                <li><a href="prices.html">Prices</a></li>
                <li><a href="services.html">Services</a></li>
                <li><a href="faq.html">FAQ</a></li>
                <li><a href="gallery.html">Gallery</a></li>
                <li><a href="login.html">Login Page</a></li>
                <li><a href="signup.html">Sign Up</a></li>
                <li><a href="page-404.html">404</a></li>
                <li><a href="page-500.html">500</a></li>
                <li><a href="search-results.html">Search Results</a></li>
                <li class="active"><a href="contacts.html">Contact</a></li>
              </ul>
            </li>

            <li class="dropdown" data-init="onHover">
              <a href="#" class="dropdown-toggle" data-toggle="dropdown" data-0="padding: 30px 25px 22px;border-bottom-width:4px;" data-100="padding: 24px 25px 16px;border-bottom-width:3px;" data-200="padding: 15px 25px 12px;border-bottom-width:2px;" data-300="padding: 15px 25px 10px;border-bottom-width:1px;">
                Portfolio <span class="caret"></span>
              </a>
              <ul class="dropdown-menu" role="menu">
                <li><a href="portfolio-4.html">Portfolio 4</a></li>
                <li><a href="portfolio-3.html">Portfolio 3</a></li>
                <li><a href="portfolio-2.html">Portfolio 2</a></li>
              </ul>
            </li>

            <li class="dropdown" data-init="onHover">
              <a href="#" class="dropdown-toggle" data-toggle="dropdown" data-0="padding: 30px 25px 22px;border-bottom-width:4px;" data-100="padding: 24px 25px 16px;border-bottom-width:3px;" data-200="padding: 15px 25px 12px;border-bottom-width:2px;" data-300="padding: 15px 25px 10px;border-bottom-width:1px;">
                Blog <span class="caret"></span>
              </a>
              <ul class="dropdown-menu" role="menu">
                <li><a href="blog.html">Blog Page</a></li>
                <li><a href="blog-item.html">Blog Item</a></li>
              </ul>
            </li>

            <li class="search"><input type="text" placeholder="&#61442;" data-0="margin-top:23px" data-300="margin-top:10px"></li>
          </ul>
        </div><!--/.navbar-collapse -->
      
      </div>

    </div>
    <!-- END NAVBAR -->









    <!-- BEGIN BREADCRUMBS -->
    <div id="breadcrumbs" class="breadcrumbs bg-1">
      <div class="container">

        <ol class="breadcrumb">
          <li><a href="index.html">Home</a></li>
          <li class="active">Contact</li>
        </ol>

        <h2><strong>Contact</strong></h2>

      </div>
    </div>
    <!-- END BREADCRUMBS -->







    <!-- MAP -->
    <section class="section" id="map-canvas">

    </section>
    <!-- END MAP -->








    <!-- CONTACT -->
    <section class="section">
      <div class="container">
        <div class="row">
          
          <div class="col-md-8">

            <div class="block appear-el" data-animation="fadeInLeft">

              <h3 class="uppercase no-top-margin"><strong>Give Us</strong> a Line</h3>

              <p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. </p>

              <form role="form">

                <div class="form-group">
                  <label for="name">Name</label>
                  <input type="text" class="form-control" id="name">
                </div>

                <div class="form-group">
                  <label for="email">Email</label>
                  <input type="email" class="form-control" id="email">
                </div>

                <div class="form-group">
                  <label for="message">Message</label>
                  <textarea class="form-control" rows="5" id="message"></textarea>
                </div>

                <button type="submit" class="btn btn-theme uppercase">Send</button>
                <button type="reset" class="btn uppercase">Cancel</button>
              </form>

            </div>

          </div>

          <div class="col-md-4">

             <div class="block appear-el" data-animation="fadeInRight">

              <h3 class="uppercase no-top-margin"><strong>Our</strong> office</h3>

              <address>
                <strong>Lorem Company, Inc.</strong><br>
                Vajnorska 127, Lorem Tower<br>
                Bratislava, SK<br>

                <strong class="block">Phone:</strong>
                CEO: +421 02 66 55 12<br>
                Support: +421 02 66 55 13

                <strong class="block">Email:</strong>
                <a href="#">ici.kamarel@tattek.sk</a><br>
                <a href="#">support@tattek.sk</a>

                <div class="social">
                  <a href="#" style="padding-left: 13px">
                    <i class="fa fa-facebook"></i>
                  </a>
                  <a href="#">
                    <i class="fa fa-twitter"></i>
                  </a>
                  <a href="#">
                    <i class="fa fa-google-plus"></i>
                  </a>
                  <a href="#">
                    <i class="fa fa-flickr"></i>
                  </a>
                  <a href="#">
                    <i class="fa fa-dribbble"></i>
                  </a>
                </div>
              </address>

              <h3 class="uppercase no-top-margin"><strong>Business</strong> Hours</h3>
              <address>
                <strong>Monday - Friday:</strong> 9:00 - 17:00<br>
                <strong>Saturday:</strong> 9:00 - 12:00<br>
                <strong>Sunday:</strong> Closed
              </address>

            </div>

          </div>

        </div>
      </div>
    </section>
    <!-- END CONTACT -->












    <!-- FOOTER -->
    <footer id="footer">

      <div class="footer-main">
        <div class="container">
          <div class="row">
            
            <div class="col-md-4">
              
              <div class="widget widget-about">
                <h4><strong>MIN</strong>IMAL</h4>
                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.</p>
              </div>

              <div class="widget widget-photo-stream">
                
                <h4><strong>Photo</strong> Stream</h4>

                <div class="flickr-feed"></div>

              </div>

            </div>

            <div class="col-md-4">
              
              <div class="widget widget-contact">
                <h4><strong>Contact</strong> Us</h4>
                <address>
                  <strong>Lorem Company, Inc.</strong><br>
                  Vajnorska 127, Lorem Tower<br>
                  Bratislava, SK<br>
                  <strong>Phone:</strong> +421 948 964 956<br>
                  <strong>Fax:</strong> +421 02 66 21 54<br>
                  <strong>Email:</strong> <a href="mailto:minoral@tattek.com">minoral@tattek.com</a><br>
                  <strong>Skype:</strong> <a href="#">tattek</a>
                </address>
              </div>

              <div class="widget widget-social">
                <a href="#">
                  <span class="overlay bg-cyan"></span>
                  <i class="fa fa-twitter" style="padding-left: 10px;"></i>
                </a>
                <a href="#"><span class="overlay bg-blue"></span><i class="fa fa-facebook" style="padding-left: 14px;"></i></a>
                <a href="#"><span class="overlay bg-red"></span><i class="fa fa-google-plus" style="padding-left: 10px;"></i></a>
                <a href="#"><span class="overlay"></span><i class="fa fa-flickr" style="padding-left: 10px;"></i></a>
                <a href="#"><span class="overlay bg-hotpink"></span><i class="fa fa-dribbble" style="padding-left: 10px;"></i></a>
              </div>

              <div class="widget widget-newsletter">
                
                <h4><strong>Newsletter</strong></h4>
                <p>Subscribe to our newsletter and stay up to date with the latest news and deals!</p>
                
                <div class="input-group">
                  <input type="text" class="form-control" placeholder="Enter your email adress">
                  <span class="input-group-btn">
                    <button class="btn btn-theme" type="button">Subscribe</button>
                  </span>
                </div>

              </div>

            </div>

            <div class="col-md-4">
              <div class="widget widget-tweets">
                <h4><strong>Latest</strong> Tweets</h4>

                <a class="twitter-timeline" href="https://twitter.com/envato" data-widget-id="471668556904419328" data-tweet-limit="3" data-theme="dark" data-link-color="#418bca" data-chrome="noheader nofooter noscrollbar noborders transparent">Tweets by @envato</a>

              </div>
            </div>

          </div>
        </div>
      </div>

      <div class="footer-bottom">
        <div class="container">
          <div class="row">

            <div class="col-md-4 copyright">
              &copy; Copyright 2014 by <a href="#">Minimal</a>. All Rights Reserved.
            </div>

            <div class="col-md-8">
              <nav>
                <ul class="footer-nav">
                  <li><a href="index.html">Home</a></li>
                  <li><a href="about.html">About Us</a></li>
                  <li><a href="prices.html">Prices</a></li>
                  <li><a href="services.html">Services</a></li>
                  <li class="active"><a href="contacts.html">Contacts</a></li>
                </ul>
              </nav>
            </div>

          </div>
        </div>
      </div>

    </footer>
    <!-- END FOOTER -->







    <!-- SCROLL TOP -->
    <div class="scroll-top">
      <a href="#">
        <i class="fa fa-angle-up"></i>
      </a>
    </div>
    <!-- END SCROLL TOP -->










    
    <script src="assets\js\vendor\modernizr-2.6.2-respond-1.1.0.min.js"></script>

    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="jquery/jquery.js"></script>

    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="assets\js\vendor\bootstrap\bootstrap.min.js"></script>

    <script src="assets\js\vendor\skrollr\skrollr.min.js"></script>

    <script src="assets\js\vendor\text-rotator\jquery.simple-text-rotator.js"></script>

    <script src="assets\js\vendor\owl-carousel\owl.carousel.min.js"></script>

    <script src="assets\js\vendor\nivo-lightbox\nivo-lightbox.min.js"></script>

    <script src="assets\js\vendor\tweet-js\jquery.tweet.min.js"></script>

    <script src="assets\js\vendor\vticker\jquery.vticker.min.js"></script>

    <script src="assets\js\vendor\jflickrfeed\jflickrfeed.min.js"></script>

    <script src="assets\js\vendor\appear\jquery.appear.js"></script>

    <script src="assets\js\vendor\parallax\jquery.parallax-1.1.3.js"></script>

    <script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>    

    <script src="assets\js\minimal.min.js"></script>

    <script>

      $(window).load(function(){


        //Google Map
        var latlng = new google.maps.LatLng(48.1782889,17.1488987);
        var settings = {
          zoom: 13,
          center: new google.maps.LatLng(48.1782889,17.1488987), mapTypeId: google.maps.MapTypeId.ROADMAP,
          mapTypeControl: false,
          scrollwheel: false,
          draggable: true,
          mapTypeControlOptions: {style: google.maps.MapTypeControlStyle.DROPDOWN_MENU},
          navigationControl: false,
          navigationControlOptions: {style: google.maps.NavigationControlStyle.SMALL},
          mapTypeId: google.maps.MapTypeId.ROADMAP};


        var map = new google.maps.Map(document.getElementById("map-canvas"), settings);

        google.maps.event.addDomListener(window, "resize", function() {
          var center = map.getCenter();
          google.maps.event.trigger(map, "resize");
          map.setCenter(center);
        });

        var contentString = '<div id="content">'+
                '<div id="siteNotice">'+
                '</div>'+
                '<h3 id="firstHeading" class="no-top-margin"><strong>Office</strong></h3>'+
                '<div id="bodyContent">'+
                '<p>Here you can find us!</p>'+
                '</div>'+
                '</div>';
        var infowindow = new google.maps.InfoWindow({
          content: contentString
        });

        var companyPos = new google.maps.LatLng(48.1782889,17.1488987);

        var companyMarker = new google.maps.Marker({
          position: companyPos,
          map: map ,
          title:"Our Office",
          zIndex: 3});



        google.maps.event.addListener(companyMarker, 'click', function() {
          infowindow.open(map,companyMarker);
        });

      });

      $(function(){

      })

    </script>

  </body>
</html>